<template>
  <Wrapper>
    <div class="merak-container-has-aside" curPageName="...">
      <!-- 包装层 可在末尾追加弹窗、抽屉等组件 curPageName 用于页面检索 -->
      <div class="merak-aside">
        <!-- 侧边栏 可向下复制 可删除 -->
      </div>
      <div class="merak-card merak-container-has-search">
        <!-- 主容器 可随意放置高级搜索等组件 也可不放置 -->
        <div class="merak-table-wrapper">
          <!-- table 组件区域 仅允许放置 table -->
        </div>
      </div>
    </div>
  </Wrapper>
  <slot :html="html" />
</template>

<script setup lang="ts" name="...">
// name 用于控制本页面缓存
import { ref } from "vue";
import Wrapper from "./Wrapper.vue";

const html = ref(`
<template>
    <div class="merak-container-has-aside" curPageName="...">
        <!-- 包装层 可在末尾追加弹窗、抽屉等组件 curPageName 用于页面检索 -->
      <div class="merak-aside">
        <!-- 侧边栏 可向下复制 可删除 -->
      </div>
      <div class="merak-card merak-container-has-search">
        <!-- 主容器 可随意放置高级搜索等组件 也可不放置 -->
        <div class="merak-table-wrapper">
            <!-- table 组件区域 仅允许放置 table -->
        </div>
      </div>
    </div>
</template>

<script. setup lang="ts" name="...">
// name 用于控制本页面缓存
</script.>

<style scoped lang="scss"></style>
`);
</script>

<style scoped lang="scss"></style>
